<template>
  <div>
    <h2 style="text-align: center">选择访问开放平台的身份</h2>
    <!-- 确认是用户身份，还是应用身份 -->
    <el-row class="info">
      <el-col :span="12" @click="goToAppInfo" class="info-entry">
        <i class="el-icon-setting icon-size">以应用身份访问</i>
      </el-col>
      <el-col :span="12" @click="goToUserInfo" class="info-entry">
        <i class="el-icon-user-solid icon-size">以用户身份访问</i>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'confirmInfo',
  methods: {
    goToAppInfo() {
      this.$router.push({
        path: '/confirmInfo/appBaseInfo',
      });
    },
    goToUserInfo() {
      this.$router.push({
        path: '/confirmInfo/userInfo',
      });
    },
  },
};
</script>

<style scoped>
.info {
  height: 600px;
  width: 100%;
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-content: center;
}

.info .info-entry {
  margin: auto;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}

.info .info-entry i {
  margin: auto;
}

.icon-size {
  font-size: 40px;
}
</style>
